<template>
	<view class="index">
		<view class="bf dfbc w100 p-10-0">
			<view class="" style="width: 24%;"></view>
			<view class="tabs dfa" style="width:50%;">
				<view class="tab tac" :class="current === index?'isTab':''" v-for="(item,index) in tabs" :key="index"
					:style="{color:current == index?'#000':'#000',background:current == index?subColor:'#eee'}"
					@click="handTab(item,index)">{{item.label}}</view>
			</view>
			<view class="dfac" style="width: 24%;">
				<!-- <u-icon name="setting" color="#000" size="28" @click="toSet"></u-icon> -->
			</view>
		</view>
		<view class="f-1 bf8">
			<call v-if="current==0" :list="callList" @call="call" @qc="qc"></call>
			<pass :list="callList" @call="call" v-else></pass>
		</view>
		
		<view class="buts pb10 bf">
			<view class="p-10-20 mb10 ">
				<view class="cf bs30 tac p10 wei" :style="{background:'linear-gradient(to right, #fee14f, #fdc450)',color:'#000'}" @click="rf">手动刷新</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import route from '../../../uni_modules/uview-ui/libs/util/route'
	import call from './components/call.vue'
	import pass from './components/pass.vue'
	export default {
		components: {
			call,
			pass
		},
		data() {
			return {
				subColor: uni.getStorageSync('subject_color'),
				current: 0,
				tabs: [{
					label:'叫号',
					value:'maked',
				},{
					label:'过号',
					value:'complete',
				}],
				list: [{
					type: 1, //1堂食
					time: '07/13 11:09',
					order: '14',
					total: 0,
					menu: []
				}, {
					type: 2,
					time: '07/13 14:29',
					order: '0023',
					total: 4,
					menu: [{
						name: '菜菜菜1',
						num: 1,
					}, {
						name: '菜菜菜2',
						num: 1,
					}, {
						name: '菜菜菜3',
						num: 1,
					}, {
						name: '菜菜菜4',
						num: 1,
					}]
				}],
				callList:[],
				state:'maked'
			}
		},
		onLoad() {
			this.fetchData()
		},
		methods: {
			async fetchData() {
				const {
					data: {
						list
					}
				} = await this.beg.request({
					url: this.api.takeScreen,
					data:{
						state:this.state
					}
				})
				this.callList = list ? list : []
			},
			async rf() {
				await this.fetchData()
				uni.$u.toast('刷新成功')
			},
			toSet() {
				uni.navigateTo({
					url: '/pages/order/lineUp/setting/index'
				});
			},
			handTab(v,i){
				this.current = i
				this.state = v.value
				this.fetchData()
			},
			async call(v){
				const {
					msg
				} = await this.beg.request({
					url: `${this.api.call}/${v.id}`,
					method:"POST",
				})
				uni.$u.toast(msg)
				this.fetchData()
			},
			async qc(v){
				const {
					msg
				} = await this.beg.request({
					url: `${this.api.qcComplete}/${v.id}`,
					method:"POST",
				})
				uni.$u.toast(msg)
				this.fetchData()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tabs {
		padding: 5rpx 0;
		border-radius: 15rpx;
		background-color: #fff;
		overflow: hidden;
	}

	.tab {
		padding: 15rpx;
		width: 50%;
	}

	.isTab {
		// border-radius: 15rpx;
		font-weight: 600;
		color: #fff;
	}

	/deep/.u-button {
		width: 120rpx !important;
		height: 70rpx !important;
	}
	
	.buts {
		width: 100%;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 9999;
	}
</style>